<?php $this->_extends('../_layouts/default_layout');?>
<?php $this->_block('contents');?>
<link type="text/css" href="<?=Q::ini('custom_system/base_url')?>css/prettyphoto.css" rel="stylesheet" />
<script type="text/javascript" src="<?=Q::ini('custom_system/base_url')?>js/jq.mselect.js?"></script>
<script type="text/javascript" src="<?=Q::ini('custom_system/base_url')?>js/jq.prettyphoto.js"></script>
<script type="text/javascript" src="<?=Q::ini('custom_system/base_url')?>js/json.js"></script>
<style type="text/css">
	.prod_img_thumbnail {
		text-align: center;
	}
	.prod_img_thumbnail li.clear { 
		width: 0;
		height: 0;
		border-radius: 0;
		padding: 0;
		border: none;
	}
	
	.prod_img_thumbnail li {
		float: left;
		width: 130px;
		height: 160px;
		margin-bottom: 8px;
		margin-right: 8px;		
		border-radius: 5px;
		border: 1px solid #ccc;
		padding: 5px;
		position: relative;
	}
	.prod_img_thumbnail li a.thumb_click {
		position: absolute;
		top: 5px;
		right: 12px;
		width: 24px;
		height: 24px;
		font-size: 16px;
		font-weight: bolder;
		color: #f00;
		background: #ccc;
		opacity: .75;
		display: none;
	}
	.prod_img_thumbnail li:hover a.thumb_click {
		display: block;
	}
	.prod_img_thumbnail li:hover a.thumb_click:hover {
		opacity: .9;
		text-decoration: none;
	}
	.prod_img_thumbnail li.deselected {
		opacity: .4;
	}
	.prod_img_thumbnail li.smed {
		background: #9ECFF4;
	}
	.prod_img_thumbnail li:hover {
		border: 1px solid #333;;
		opacity: 1;
	}
	.pp_description { text-align: center; font-size: 1.5em;}	
	.thead{position:fixed; top:100px; z-index:1000;}
</style>
<script type="text/javascript" >
$(function(){
	$(".dropfalse").sortable();
	$("#check_all").click(function(){
		if ($(this).is(":checked"))
		{
			$("#list input[name^='tar_prod_sku']").attr("checked", true);
			$("#list input[name^='tar_prod_sku']").each(function(){
				$("input[name^='im_"+$(this).val()+"']").attr('checked', true);
				$("input[name^='im_"+$(this).val()+"']").parent().attr('class', '');
			});
		}
		else
		{
			$("#list input[name^='tar_prod_sku']").attr("checked", false);
			$("#list input[name^='tar_prod_sku']").each(function() {
				$("input[name^='im_"+$(this).val()+"']").attr('checked', false);
				$("input[name^='im_"+$(this).val()+"']").parent().attr('class', 'deselected');
			});
		}
		$("#export_url_ta").attr('disabled', true);
		getExportUrl();
	});
	$(".check_rows").click(function(){
		if ($(this).is(":checked"))
		{
			$("input[name^='im_"+$(this).val()+"']").each(function(){
				$(this).attr('checked', true);
				$(this).parent().attr('class', '');
			});
		}
		else
		{
			$("input[name^='im_"+$(this).val()+"']").each(function() {
				$(this).attr('checked', false);
				$(this).parent().attr('class', 'deselected');
			});
		}
		$("#export_url_ta").attr('disabled', true);
		getExportUrl();
	});
	$(".select_url").mouseover(function(){$(this).select();});
	$(".check_all").click(function(){
		$("input[name^='im_"+$(this).attr('type')+"']").each(function(){
			$(this).attr('checked', true);
			$(this).parent().attr('class', '');
		});
		$("#tar_prod_sku_id_"+$(this).attr('type')).attr("checked", true);
		$("#export_url_ta").attr('disabled', true);
		getExportUrl();
	});
	$(".check_out").click(function(){
		$("input[name^='im_"+$(this).attr('type')+"']").each(function() {
			if($(this).attr("checked"))
			{
				$(this).attr('checked', false);
				$(this).parent().attr('class', 'deselected');
			}
			else
			{
				$(this).attr('checked', true);
				$(this).parent().attr('class', '');
			}
		});
		$("#export_url_ta").attr('disabled', true);
		getExportUrl();
	});
	<?foreach ($product_image_data as $k => $v):?>
	$("a[rel^='pretty_photo[<?=$k?>]']").prettyPhoto({show_title: true,overlay_gallery: true});
	<?endforeach;?>
	
	$(".prod_img_thumbnail input[ktype='sel']").change(function(){
		console.log(this.value+this.checked);
		$(this).parent().attr("class", this.checked ? "" : "deselected");
		$("#export_url_ta").attr('disabled', true);
		getExportUrl();
	});
	$(".prod_img_thumbnail input[ktype='selm']").change(function(){
		console.log(this.value+this.checked);
		$(this).parent().siblings().removeClass("smed");
		$(this).parent().attr("class", this.checked ? "smed" : "");
		$("#export_url_ta").attr('disabled', true);
		getExportUrl();
	});
	if ($("#thead").length > 0)
	{
		var tableH = $("#thead").offset().top;
		var tableW = $("#list").width();
		$(window).scroll(function(){
			var scroH = $(this).scrollTop();
			if (tableH - scroH <= 100)
				$("#thead").attr('class', 'thead');
			else
				$("#thead").attr('class', '');
		});
	}
});
function getExportUrl()
{
	var target_skus = {};
	var target_channel = "<?=empty($_GET['target_channel']) ? 'default' : $_GET['target_channel'];?>";
	var thumb_size = "<?=empty($_GET['thumb_size']) ? '' : $_GET['thumb_size'];?>";
	$("input[name='tar_prod_sku[]']").each(function() {
		var this_sub_array = [];
		if ($("li.smed input[name='im_sm_"+this.value+"']"))
		{
			var sm_img = $("li.smed input[name='im_sm_"+this.value+"']").val();
			console.log(sm_img);
			if (sm_img) this_sub_array.push(sm_img);
		}
		$("input[name='im_"+this.value+"[]']").each(
			function() {
				if (sm_img == this.value) return;
				if ($(this).attr("checked") == "checked") this_sub_array.push(this.value);
			}
		);
		target_skus[this.value] = (this_sub_array);
	});
	$.post(
		"<?=url('Online::ProductImage/GetURLAjax')?>",
		{"target_channel" : target_channel, "product_number" : target_skus, "thumb_size" : thumb_size}, 
		function(data) {
			var final_text = "";
			var spilit_str = "<?=($_GET['file_type'] == 1) ? '\n' : '\t';?>";;
			console.log(data);
			for (var i in data)
			{
				final_text += i+spilit_str;
				for (var j in data[i])
				{
					final_text += data[i][j]+spilit_str;
				}
				final_text += "\n";
			}
			console.log(final_text);
			$("#export_url_ta").val(final_text);
			$("#export_url_ta").attr('disabled', false);
		},
		"json"
	);
}
</script>
<fieldset><legend>查询条件</legend>
<form>
<?include (Q::ini('custom_system/elements_dir') . 'searchform_element.php');?>
<table class="form_table">
<tr>
	<th><label for="pic_batch_number">产品批次号</label></th>
	<td><input type="text" id="pic_batch_number" size="24" name="pic_batch_number" value="<?=isset($_GET['pic_batch_number']) ? $_GET['pic_batch_number'] : '';?>"/></td>
</tr>
<tr>
	<th>产品编号</th>
	<td><textarea name="product_number" cols="23" rows="10" ><?=isset($_GET['product_number']) ? $_GET['product_number'] : '';?></textarea></td>
</tr>
<tr>
	<th></th>
	<td>说明：多个SKU用英文逗号分开</td>
</tr>
<tr>
	<th>上架渠道</th>
	<td>
		<select name="target_channel" id="target_channel">
			<option value="">请选择..</option>
			<?foreach ($export_channel_data as $k => $v):?>
			<optgroup label="<?=$k?>">
				<?foreach ($v as $ik => $iv):?>
				<option value="<?=$ik?>" <?if ((isset($_GET['target_channel']) && $_GET['target_channel'] == $ik))echo "selected='selected'"?>><?=$ik?></option>
				<?endforeach;?>
			</optgroup>
			<?endforeach;?>
		</select> 
	</td>
</tr>
<tr>
	<th>图片大小</th>
	<td>
		<label><input type="radio" name="thumb_size" value="0" checked="checked" /> 默认</label>
		<label><input type="radio" name="thumb_size" value="1" <?if (!empty ($_GET['thumb_size']))echo "checked='checked'"?>/> Ebay图800px</label>
	</td>
</tr>
<tr>
	<th>数据格式</th>
	<td>
		<label><input type="radio" name="file_type" value="1" checked="checked" <?if ($_GET['file_type'] == 1)echo "checked='checked'"?>/> Ebay单列</label>
		<label><input type="radio" name="file_type" value="2" <?if ($_GET['file_type'] == 2)echo "checked='checked'"?>/> Amazon多列</label>
	</td>
</tr>
<tr>
	<th></th>
	<td><input type="submit" class="button" value="查询"/></td>
</tr>
</table>
</form>
</fieldset>
<?if (! empty($product_image_data)):?>
<table class="list_table" width="100%" id="list">
<?if (! empty($export_url_data)):?>
<tr bgcolor="white" id="thead">
	<td width="72"><label><input type="checkbox" id="check_all" checked="checked"/> 全选</label></td>
	<td colspan="4" align="left">
		<textarea cols="200" rows="5" id="export_url_ta"><?=isset($export_url_data) ? $export_url_data : ''?></textarea>
	</td>
</tr>
<?endif;?>
<tr>
	<th width="80">产品编号</th>
	<th width="140">图片更新时间</th>	
	<th>图片列表</th>
	<th width="140">操作</th>
</tr>
<?foreach ($product_image_data as $k => $v):?>
<tr>
	<td>
		<input checked="checked" id="tar_prod_sku_id_<?=$k?>" name="tar_prod_sku[]" type="checkbox" value="<?=$k?>" class="check_rows" />
		<label for="tar_prod_sku_id_<?=$k?>"><?=$k?></label>
	</td>
	<td><?=$v['addtime']?></td>
	<td align="center" valign="middle">
		<ul class="prod_img_thumbnail dropfalse">
			<?foreach ($v['pic'] as $ik => $iv):?>
			<li>
				<label for='im_<?=substr($ik,10)?>'><img src="<?=$iv['thumb']['120'];?>" width="120" alt="<?=substr($ik,10)?>" title="<?=substr($ik,10)?>" /></label>
				<input ktype="sel" checked="checked" type="checkbox" id='im_<?=substr($ik,10)?>' name='im_<?=$k?>[]' value='<?=$ik?>' /><label for='im_<?=substr($ik,10)?>'><?=substr($ik,10)?></label>
				<input ktype="selm" type="radio" id='im_sm_<?=substr($ik,10)?>' name='im_sm_<?=$k?>' value='<?=$ik?>' /><label for='im_sm_<?=substr($ik,10)?>'>主</label>
				<a class="thumb_click" title="<?=substr($ik,10)?>" rel="pretty_photo[<?=$k?>]" href="<?=$iv["target"]?>">+</a>
				<input type="text" size="18" class="select_url" value="<?=empty($iv['thumb']['url']) ? '' : $iv['thumb']['url'];?>" />
			</li>
			<?endforeach;?>
		</ul>
	</td>
	<td>
		<a class="check_all" type="<?=$k?>">全选</a>
		<a class="check_out" type="<?=$k?>">反选</a>
	</td>
</tr>
<?endforeach;?>
</table>
<?endif;?>
<?php $this->_endblock();?>